<template>
	<view class="addCar">
		<u--form labelPosition="top" labelWidth="auto">
			<u-form-item label="订单类型" borderBottom>
				<view style="width: 100%;">
					<view @click="orderType = true" style="width: 90%;display: inline-block;">
						<u-input v-model="form['2er5tzaz6pqs']" disabled disabledColor="#ffffff" placeholder="请选择"
							:clearable="true || false" border="none"></u-input>
					</view>
					<uni-icons class="uni-icons" v-if="form['2er5tzaz6pqs']" @click="clearableType()" type="clear"
						color="#e1e1e1" size="16" style="width:10%;text-align: right;display: inline-block;">
					</uni-icons>
				</view>
			</u-form-item>
			<u-form-item label="订单编号" borderBottom>
				<view style="width: 100%;">
					<view @click="changeBh" style="width: 90%;display: inline-block;">
						<u-input v-model="formData.orderName" disabled disabledColor="#ffffff" placeholder="请选择"
							:clearable="true || false" border="none"></u-input>
					</view>
					<uni-icons class="uni-icons" v-if="formData.orderName" @click="clearableBh()" type="clear"
						color="#e1e1e1" size="16" style="width:10%;text-align: right;display: inline-block;">
					</uni-icons>
				</view>
			</u-form-item>
			<u-form-item label="车牌号" borderBottom>
				<view style="width: 100%;">
					<view @click="showCar" style="width: 90%;display: inline-block;">
						<u-input v-model="formData.carName" disabled disabledColor="#ffffff" placeholder="请选择"
							:clearable="true || false" border="none"></u-input>
					</view>
					<uni-icons class="uni-icons" v-if="formData.carName" @click="clearableCar()" type="clear"
						color="#e1e1e1" size="16" style="width:10%;text-align: right;display: inline-block;">
					</uni-icons>
				</view>
			</u-form-item>
		</u--form>
		<u-picker :show="orderType" itemHeight="88" :columns="orderTypeList" keyName="name" closeOnClickOverlay
			@cancel="orderType = false" @close="orderType = false" @confirm="typeSelect"></u-picker>
		<u-picker :show="orderName" itemHeight="88" :columns="orderNameOptions" keyName="name" closeOnClickOverlay
			@cancel="orderName = false" @close="orderName = false" @confirm="nameSelect"></u-picker>
		<u-picker :show="carShow" itemHeight="88" :columns="carList" keyName="name" closeOnClickOverlay
			@cancel="carShow = false" @close="carShow = false" @confirm="changeCar"></u-picker>
		<view class="" style="margin-top: 30px;">
			<u-button type="primary" text="提交" @click="save()"></u-button>
		</view>
		<u-toast ref="uToast" />
	</view>
</template>

<script>
	import {
		getCaiGouDingDan,
		getFaHuoDingDan,
		getCarNumList,
		addCar
	} from '@/api/car.js'
	export default {
		data() {
			return {
				form: {},
				formData: {
					orderName: '',
					carName: ''
				},
				orderType: false,
				orderTypeList: [
					[{
							name: '发货订单',
							id: '发货订单'
						},
						{
							name: '采购订单',
							id: '采购订单'
						},
					]
				],
				orderName: false,
				orderNameOptions: [],
				carShow: false,
				carList: []
			}
		},
		methods: {
			typeSelect(e) {
				this.form['2er5tzaz6pqs'] = e.value[0].name;
				this.form.ceh5tzaz3tb9 = ''
				this.formData.orderName = '';
				this.formData.carName = '';
				this.form.qb85tzazmn3p = '';
				this.orderNameOptions = [];
				this.carList = []
				if (this.form['2er5tzaz6pqs'] === '发货订单') {
					this.getFaHuoDingDan();
					this.orderType = false
				} else {
					this.getCaiGouDingDan();
					this.orderType = false
				}
			},
			changeBh() {
				if (this.form['2er5tzaz6pqs']) {
					this.orderName = true
				} else {
					this.$refs.uToast.show({
						type: 'info',
						icon: false,
						title: '提示',
						message: '请选择订单类型',
					});
				}
			},
			showCar() {
				if (this.formData.orderName) {
					this.carShow = true
				} else {
					this.$refs.uToast.show({
						type: 'info',
						icon: false,
						title: '提示',
						message: '请选择订单编号',
					});
				}
			},
			clearableType() {
				this.form['2er5tzaz6pqs'] = '';
				this.form.ceh5tzaz3tb9 = ''
				this.formData.orderName = '';
				this.formData.carName = '';
				this.form.qb85tzazmn3p = '';
				this.orderNameOptions = [];
				this.carList = []
			},
			clearableBh() {
				this.form.ceh5tzaz3tb9 = '';
				this.formData.orderName = '';
				this.formData.carName = '';
				this.form.qb85tzazmn3p = '';
				this.carList = []
			},
			clearableCar() {
				this.formData.carName = '';
			},
			nameSelect(e) {
				this.form.ceh5tzaz3tb9 = e.value[0].id;
				this.formData.orderName = e.value[0].name;
				this.orderName = false
				this.formData.carName = ''
				this.form.qb85tzazmn3p = ''
				this.getCarList()
			},
			changeCar(e) {
				this.formData.carName = e.value[0].name
				this.form.qb85tzazmn3p = e.value[0].id
				this.carShow = false
			},
			//车辆
			async getCarList() {
				let obj = {
					['2er5tzaz6pqs']: this.form['2er5tzaz6pqs'],
					ceh5tzaz3tb9: this.form.ceh5tzaz3tb9,
					h29g7a20gdtkb: 3
				}
				const {
					data
				} = await getCarNumList(obj)
				let newArr = []
				data.data.map(a => {
					let obj = {}
					obj.name = a['0zyg7a20lrjby']
					obj.id = a.id
					newArr.push(obj)
				})
				this.carList.push(newArr)
			},
			// 发货订单
			async getFaHuoDingDan() {
				const {
					data
				} = await getFaHuoDingDan()
				let newarr = []
				data.data.map(a => {
					let obj = {}
					obj.name = a['3sgg7a1sb3ne3']
					obj.id = a.id
					newarr.push(obj)
				})
				this.orderNameOptions.push(newarr)
			},
			// 采购订单
			async getCaiGouDingDan() {
				const {
					data
				} = await getCaiGouDingDan()
				let newarr = []
				data.data.map(a => {
					let obj = {}
					obj.name = a['3sgg7a1sb3ne3']
					obj.id = a.id
					newarr.push(obj)
				})
				this.orderNameOptions.push(newarr)
			},
			save() {
				addCar(this.form).then(res => {
					if (res.data.code === 1) {
						this.$refs.uToast.show({
							type: 'success',
							icon: false,
							title: '提示',
							message: res.data.msg,
						});
						uni.redirectTo({
							url: `/pages/carYuYue/carYuYue`
						});
					}
				})
			},
		}
	}
</script>

<style>
	.addCar {
		width: 95%;
		margin: 0 auto;
	}
</style>
